<script type="text/javascript" src="typewatch.js"></script>
<script type="text/javascript">
var newuser=false;
var username_available=false;
var own_url="not_used";
var devices;

//ajax psot
function post() {
	
	var username1 = $('#username').val();
	var password1 = $('#password').val();
	var devicename1 = $('#devicename').val();	
	
	var url = server_url;
	if(own_url!="not_used") {
		url=own_url;
	}
	
	$.post(url, { c: 3, u: username1, p: bg.getHash(password1), d: devicename1 }, function(data) {
		try {
			console.log("post - 1:"+data);
            var json_obj = $.parseJSON(data);
            switch (json_obj.code) {
            case 0:  
           			console.log("post - 1.5");
            		devices = json_obj.devices;
        			username = $('#username').val();
        			password = $('#password').val();
        			if(own_url != "not_used") {
        				server_url=own_url;
        			}	
        			devicename = $('#devicename').val();
        			console.log("post - 2");
        			showFinishlogin(300, 300);					
                break;

            case 1:
                //general error
                $('#info').fadeOut(0);
                $('#info').fadeIn(300).html('<font color="#FF0000">Unknown Error, setup couldnt be finished.</font>');
                break;

            case 2:
                //general error
                $('#info').fadeOut(0);
                $('#info').fadeIn(300).html('<font color="#FF0000">Username is wrong.</font>');
                break;
                
            case 3:
                //general error
                $('#info').fadeOut(0);
                $('#info').fadeIn(300).html('<font color="#FF0000">Password is wrong.</font>');
                break;
                
            case 4:
                //general error
                $('#info').fadeOut(0);
                $('#info').fadeIn(300).html('<font color="#FF0000">You already added a Device with that name.</font>');
                break;

            default:
                break;
            }
        } catch (err) {
            //general error
            $('#info').fadeOut(0);
            $('#info').fadeIn(300).html('<font color="#FF0000">Very Unknown Error, setup couldnt be finished: </font>' + err);
        }
   	});	
}

//check available END
	
	$('#button_next').click(function(){	
		
		var errors = [];	
		
		if (!($('#password').val().length > 2)) {
			errors.push('<font color="#FF0000">The Password is too short (less than 3 chars)!</font>');
		}
		
		if (!($('#devicename').val().length > 2)) {
			errors.push('<font color="#FF0000">Device Name is too short (less than 3 chars) !</font>');
		}
		
		if (!($('#username').val().length > 2)) {
			errors.push('<font color="#FF0000">Username is too short (less than 3 chars) !</font>');
		}
		
		if (errors.length == 0) {
 			$('#info').html("");
 			post();
		} else {
			$('#info').fadeOut(0);
			$('#info').fadeIn(300).html(errors.join('<br />'));
		}
	});	
	
	
	$('#ownserver').bind('click', checkboxClicked);		
						
	function checkboxClicked(event){
		if($('#ownserver').prop("checked")) {
			disablediv("content2");
			$('#content3').fadeOut(0);
        	$('#content3').fadeIn(300).load('optionpages/ownserver.html');			
		}else{
			enablediv("content2");
			$('#content3').fadeOut(300,function(){
				$('#content3').html("");			
			});
			own_url="not_used";
		}
	}
	
	function disablediv(id){
		
			$('#'+id+' :input').attr('disabled', true);
		
		
	}
	function enablediv(id){
        $('#'+id+' :input').removeAttr('disabled');
       
	}
	
</script>
<div id="content0">	
		<div id="content1">
	<table>
	<tr><td id="serverchoice" colspan="2">
	<input type=checkbox id="ownserver" value="true"> I want to use my own server (for advanced users)
	</td></tr>
	</table>
		</div>
		<div id="content3">
		</div>
		<div id="content2">
	<table>
	
	<tr style="white-space:nowrap;"><td>		
	Username: 
	</td><td style="white-space:nowrap;">
	<input type="text" id="username" name="username" value"" size="11">
	</td></tr>
	<tr><td>
	Password: 
	</td><td>
	<input type="password" id="password" name="password" value"" size="13">
	</td></tr>
	<tr><td>
	Devicename: 
	</td><td>
	<input type="text" id="devicename" name="devicename" value"device1" size="12">	
	</td></tr>
	<tr><td colspan="2">
	<input type="button" id="button_next" value="Login and Next"></button>
	</td></tr>
	</table>
		</div>
	
</div>